
import {request } from "../../request/index.js";
Page({

    /**
     * 页面的初始数据
     */
    data: {
      // 左侧菜单数据
      leftMenuList:[],
      // 右侧的商品数据
      rightContent:[],
      // 被点击胡左侧胡菜单
      currentIndex:0,
      // 右侧内容的滚动条距离顶部的距离
      scrollTop:0

    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
       /*1.先判断一下本地存储中有没有旧的数据
       本地存储的数据格式{time:Date.now(),data:[...]}前面存放时间戳后面存放数据
         2.没有就数据 直接发送新的请求
         3，有旧的数据且旧数据没有过期失效，直接使用旧数据即可
          */
    // 1.获取本地存储的数据（小程序中也是存在本地存储技术的）
    const Cates=wx.getStorageSync("cates");
    // 判断
    if (!Cates){
      //不存在 发送请求获取数据
      this.getCates();
    }else{
      // 有旧的数据 定义一个过期时间 10s 改成 5min
      if(Date.now()-Cates.time>1000*10){
      // 重新发送请求
      this.getCates();
    }else{
      // 可以使用旧的
      this.Cates=Cates.data;
      let leftMenuList=this.Cates.map(v=>v.cat_name)
        // 构造右侧商品数据
        let rightContent=this.Cates[0].children;
        this.setData({leftMenuList,rightContent})
    }
  }
    },
    // 接口返回数据
    Cates:[],

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {

    },
    // 获取分类的数据
    async getCates(){
      // request({
      //   url:"/categories"
      // })
      
        // 使用es7的async await来发送请求
        const res=await request({url:"/categories"});
        
          this.Cates=res;
          //  把接口数据存入到本地存储中
          wx.setStorageSync("cates",{time:Date.now(),data:this.Cates})
          // 构造左侧的大菜单数据
          let leftMenuList=this.Cates.map(v=>v.cat_name)
          // 构造右侧商品数据
          let rightContent=this.Cates[0].children;
          this.setData({leftMenuList,rightContent})
  
      },
    // 左侧菜单点击事件
    handleItemTap(e){
    /* 获取被点击的标题身上的索引
    给adta中的currentIndex赋值就可以了*/
    const {index}=e.currentTarget.dataset;
   
    let leftMenuList=this.Cates.map(v=>v.cat_name)
        // 构造右侧商品数据
        let rightContent=this.Cates[index].children;
        this.setData({
          currentIndex:index,
          rightContent,
          // 重新设置右侧内容的scroll-view标签距离顶部的距离
          scrollTop:0
        })
        
    
    }
    
})